<template>

    <el-date-picker v-model="innerValue"
                    :disabled="$attrs['disabled']||false"
                    :placeholder="$attrs['placeholder']||'请选择'"
                    :clearable="$attrs['clearable']"
                    :type="$attrs['type']||'date'"
                    :size="$attrs['size']"
                    :picker-options="$attrs['picker-options']"
                    :default-time="$attrs['default-time']"
                    @change="(vakue)=>changeValue(vakue)"
                    @blur="(vakue)=>{
                        $emit('blur',vakue)
                    }"
                    value-format="YYYY-MM-DD HH:mm:ss"

    ></el-date-picker>
  </template>
  <script>

  import { dateFormatYYYYMMDDHHmmss, isIOS } from '@/utils'

   function adapterIOS(str){
     if (isIOS()) {
       str = str?.replace(/-/g, '/')
     }
     return str
   }

    export default {
      props: {
        value: [String, Object, Number, Date],
      },
      data() {
        return {
          timePickerOption: {
            disabledDate(time) {
              const dateTime = new Date();
              const startDateTime = dateTime.setDate(dateTime.getDate() - 1);
              return time.getTime() < new Date(startDateTime).getTime();
            },
          },
          innerValue: adapterIOS(dateFormatYYYYMMDDHHmmss(this.$props.value||undefined)),
        };
      },

      watch: {
        "$props.value"(_val) {
          this.innerValue = adapterIOS(dateFormatYYYYMMDDHHmmss(_val))
        },
      },
      mounted() {
      },
      destroyed() {
        this.innerValue = undefined
      },


      methods: {
        computedFomat() {
         var _datetype=this.$attrs['type']||'date'
          if(_datetype=='month'){
            return 'yyyy-MM'
          }  if(_datetype=='date'){
         return 'yyyy-MM-dd'
         }else if(_datetype=='datetime'){
           return 'yyyy-MM-dd HH:mm:ss'
         }else if(_datetype=='month'){
           return 'yyyy-MM'
         }
          return 'yyyy-MM-dd'
        },

        changeValue(val) {
          console.log('日期修改', val);
          if (!val) {
            this.$emit('input', undefined);
            return false;
          }
          this.innerValue=val;
          this.$emit('input', val);
          console.log("-> changeValue datepicker val", val);
          this.$emit('change',val);
        },
      },
    };
  </script>
